<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ include file="/include/taglib.jsp"%>
<html>
<head>
<meta charset="UTF-8">
<title>我的账户-手机找回密码|验证并重置</title>
<jsp:include page="/include/wchat/head.jsp"></jsp:include>

<link type="text/css" rel="stylesheet" href="/v2/wchat/resrc/css/account.css">
<script type="text/javascript">

/**
 * 页面加载后执行
 */
$(function(){
	//倒计时
	_interval = setInterval("smsSend()", 1000);
});

/**
 * 验证手机码
 */
function verifyMobileCode() {
	//手机号
	var $mobile = $('#mobile');
	//验证码
	var $code = $('#code');
	//认证id
	var $mai = $('#mai');
	//信息提示
	var $errorMsg = $('#errorMsg');
	
	//检验手机号
	if ($mobile.val() == null || $mobile.val() == '') {
    	$errorMsg.html('请输入手机号').show();
    	return false;
	}
	var regMobile = /^(13[0-9]|15[0-9]|18[0-9])\d{8}$/;
	if(!regMobile.test($mobile.val())){
		$errorMsg.html('手机号格式不正确，请检查').show();
	    return false;
	}
	//检验验证码
	if ($code.val() == null || $code.val() == '') {
    	$errorMsg.html('请输入验证码').show();
    	return false;
	}
	var regCode = /^\d{6}$/;
	if(!regCode.test($code.val())){
		$errorMsg.html('验证码输入错误，请检查').show();
	    return false;
	}
	//检验认证id
	if ($mai.val() == null || $mai.val() == '') {
    	$errorMsg.html('请刷新页面后重新验证').show();
    	return false;
	}
	var regMai = /^\d+$/;
	if(!regMai.test($mai.val())){
		$errorMsg.html('请刷新页面后重新验证').show();
	    return false;
	}
	var param = {};
    param["paramMap.mobile"] = $mobile.val();
    param["paramMap.code"] = $code.val();
    param["paramMap.mai"] = $mai.val();
	//异步请求
	$.ajax({
		type: 'POST',
		url: environment.basePath + "/verifyMobileCode4ResetPwd.do",
		data: param,
		success: function(data) {
			//错误等信息提示
			if(data.code < 0){
				$errorMsg.html(data.msg).show();
				return false;
			}
			
			//跳转至验证手机号成功页面
			window.location.href = environment.basePath + "/verifySuccess4ResetPwd.do";
		}
	});//End...$.ajax
}

/**
 * 修改手机码
 */
function editMobile() {
	window.location.href = environment.basePath + "/inputMobile4ResetPwd.do?mobile=" + $('#mobile').val();
}

/**
 * 获取手机验证码，选择获取方式
 */
function choose() {
	if(!$("#chooseA").hasClass("btn-resend")){
		$("#chooseCodeTypeDiv").show();
	}
}

/**
 * 获取手机验证码
 * @param type 获取方式
 *				约定 1 短信获取；2 电话获取
 */
function getMobileCode(type) {
	//手机号
	var $mobile = $('#mobile');
	//认证id
	var $mai = $('#mai');
	//信息提示
	var $errorMsg = $('#errorMsg');
	
	//检验手机号
	if ($mobile.val() == null || $mobile.val() == '') {
    	$errorMsg.html('请输入手机号').show();
    	return false;
	}
	var regMobile = /^(13[0-9]|15[0-9]|18[0-9])\d{8}$/;
	if(!regMobile.test($mobile.val())){
		$errorMsg.html('手机格式不正确，请检查并重新输入').show();
	    return false;
	}
	//检验认证id
	/*if ($mai.val() == null || $mai.val() == '') {
    	alert('参数非法');
    	return false;
	}
	var regMai = /^\d+$/;
	if(!regMai.test($mai.val())){
		alert("参数非法");
	    return false;
	}*/
	//检验获取方式
	if (type != 1 && type != 2) {
    	$errorMsg.html('参数非法').show();
    	return false;
	}
	var param = {};
    param["paramMap.mobile"] = $mobile.val();
    param["paramMap.type"] = type;
	
	//异步请求
	$.ajax({
		type: 'POST',
		url: environment.basePath + "/getMobileCode4ResetPwd.do",
		//data: {"mobile": $mobile.val(), "mai": $mai.val(), "type": type},
		data: param,
		success: function(data) {
			//错误等信息提示
			if(data.code < 0){
				$errorMsg.html(data.msg).show();
				return false;
			}
			
			//重设认证id
			$mai.val(data.dict.mobileAuthenId);
			//倒计时
			_interval = setInterval("smsSend()", 1000);
		}
	});//End...$.ajax
}

/**
 * 60秒计时
 */
var n = 60;
/**
 * 连续执行方法句柄
 */
var _interval;
/**
 * 发送手机短信后循环执行方法
 */
function smsSend(){
	n--;
	
	//获取验证码按钮 不可用
	$("#chooseA").addClass("btn-resend");
	$("#chooseA").removeAttr("onclick");
    $("#chooseA").html(n + "秒后重发");
	//隐藏选择方式
	$("#chooseCodeTypeDiv").hide();
	
	if (n == 0) {
	    $("#chooseA").removeClass("btn-resend");
	    $("#chooseA").attr("onclick","return getMobileCode(1);");
	    $("#chooseA").html("获取验证码");
		clearInterval(_interval);
		n = 60;
	}
}

</script>
</head>
<body>
<div id="header"> 
	<a href="javascript:history.go(-1);" class="backto">返回</a>
	<div class="title-sub">找回密码</div>
</div>
<div id="wrap">
	<div class="findpwd">
		<div class="link-touch">
			<ul class="items">
				<li> 
					<span class="txt">手机</span> 
					<span class="value">${mobile}</span>
					<a href="javascript:;" class="btn btn-verify" onclick="return editMobile();">修改</a> 
				</li>
				<li>
					<label class="txt">验证</label>
					<input type="text" id="code" class="input" placeholder="请确认短信验证码" maxlength="6" />
					
					<input type="hidden" id="mobile" name="mobile" value="${mobile}" />
					<input type="hidden" id="mai" name="mai" value="${mai}" />
					
					<a href="javascript:;" id="chooseA" class="btn btn-verify" onclick="return getMobileCode(1);">获取验证码</a> 
				</li>
			</ul>
			<div id="errorMsg" class="vtip errs none">验证码错误,请重新输入</div>
		</div>
		<div id="chooseCodeTypeDiv" class="tips-type none"> 请选择获取验证码的方式：
			<div class="type">
				<a class="btn fl" href="javascript:;" onclick="return getMobileCode(1);">短信获取</a>
				<a class="btn fr" href="javascript:;" onclick="return getMobileCode(2);">电话获取</a>
			</div>
		</div>
		<div class="operate-button operate-acc"> 
			<a href="javascript:;" class="btn" onclick="return verifyMobileCode();">验证并重置密码</a>
			<a href="/inputMail4ResetPwd.do" class="btn-server">使用注册邮箱找回密码</a>
		</div>
	</div>
</div>

<jsp:include page="/include/wchat/footer.jsp"></jsp:include>

</body>
</html>